<template>
	<el-dialog v-model="props.show" width="500" top="20vh" close-icon="CloseBold" @close="closeEvent">
		<template #title>
			<div class="text-18px font-bold">
				转账详情
			</div>
		</template>
		<template #default>
			<div class="flex flex-col items-center">
				<p class="text-#86909C text-18px mt-20px mb-20px">数量</p>
				<p class="text-#000000 font-bold text-18px">-0.23252 USDT</p>
				<div class="flex items-center mb-30px mt-20px">
					<img src="/more/result-fill.svg" class="w-24px h-24px mr-10px"/>
					<p class="text-#07B175 text-14px">成功</p>
				</div>
				<div class="w-full pt-30px border-t-2px pb-20px border-solid border-#E5E6EB">
				  <div class="text-#86909C text-14px flex items-center justify-between w-full mb-14px">
					<p>
						对方账户
					</p>
					<div class="text-#000000 flex items-center">
						<p class="mr-10px">102550256203</p>
						<img src="/transaction/spot/copy.svg" class="w-16px h-16px"/>
					</div>
				  </div>
				
				  <div class="text-#86909C text-14px flex items-center justify-between w-full mb-14px">
					<p>
						转账时间
					</p>
					<div class="text-#000000 flex items-center">
						<p>2025-02-02 17:26:14</p>
					</div>
				  </div>

				  <div class="text-#86909C text-14px flex items-center justify-between w-full mb-14px">
					<p>
						单号
					</p>
					<div class="text-#000000 flex items-center">
						<p class="mr-10px">102550256203</p>
						<img src="/transaction/spot/copy.svg" class="w-16px h-16px"/>
					</div>
				  </div>

				  <div class="text-#86909C text-14px flex items-center justify-between w-full mb-14px">
					<p>
						支付方式
					</p>
					<div class="text-#000000 flex items-center">
						<p>资金账户</p>
					</div>
				  </div>

				  <div class="text-#86909C text-14px flex items-center justify-between w-full mb-14px">
					<p>
						币种
					</p>
					<div class="text-#000000 flex items-center">
						<p>USDT</p>
					</div>
				  </div>
				</div>
			</div>
		</template>
	</el-dialog>
</template>
<script setup lang="ts">
import { ref } from 'vue'
interface IProps {
	show: boolean
}

const props = defineProps<IProps>();

const emit = defineEmits(['close'])
const closeEvent = () => {
	emit('close', false)
}
</script>

